<extend name="Public:header"/>
<block name="main-content">
    <section>
        <!-- page heading start-->
        <div class="page-heading">
            <h3>
                {$title['title']}
            </h3>
            <ul class="breadcrumb">
                <li>
                    <a href="#">主页</a>
                </li>
                <li class="active"> {$title['title']} </li>
            </ul>
        </div>
        <!-- page heading end-->

        <!--body wrapper start-->
        <div class="wrapper">
            <div class="row">
                <div class="col-sm-12">
                    <section class="panel">
                        <header class="panel-heading">
                            {$title['title']}
                            <span class="tools pull-right">
                                <a href="javascript:;" class="fa fa-chevron-down"></a>
                                <a href="javascript:;" class="fa fa-times"></a>
                             </span>
                        </header>
                        <div class="panel-body">

                            <!-- Modal -->
                            <form action="__APP__/Admin/Area/add" method="post" enctype="multipart/form-data">
                                <div class="form-group">
                                    <label>区域名称</label>
                                    <input type="text" class="form-control" name="name"  placeholder="城市名称">
                                </div>

                                <div class="form-group">
                                    <label>是否显示</label>
                                    <br>
                                    <label class="radio-inline" style="padding: 30px;"><input type="radio" name="is_show"  value="1" checked=""> 是</label>
                                    <label class="radio-inline" style="padding: 30px;"><input type="radio" name="is_show"  value="0"> 否</label>

                                </div>


                                <div class="form-group">
                                    <label class="control-label col-md-3">区域图片</label>
                                    <div class="col-md-9">
                                        <div class="fileupload fileupload-new" data-provides="fileupload">
                                            <div class="fileupload-new thumbnail" style="width: 200px; height: 150px;">
                                                <img  name="avatar" src="https://wechatpic.7rose.cn/wegw/images/add_img.jpg" alt="" />
                                            </div>
                                            <div class="fileupload-preview fileupload-exists thumbnail" style="max-width: 400px; max-height: 300px; line-height: 20px;"></div>
                                            <div>
                                                   <span class="btn btn-default btn-file">
                                                   <span class="fileupload-new"><i class="fa fa-paper-clip"></i>选择图片</span>
                                                   <span class="fileupload-exists"><i class="fa fa-undo"></i> 更换</span>
                                                   <input type="file" name="image" class="default"  />
                                                   </span>
                                                <a href="#" class="btn btn-danger fileupload-exists" data-dismiss="fileupload"><i class="fa fa-trash"></i> 取消</a>
                                            </div>
                                        </div>
                                        <br/>
                                    </div>
                                </div>

                                <button type="submit" class="btn btn-default">创建</button>
                            </form>
                            <!-- modal -->

                        </div>
                    </section>
                </div>
            </div>
        </div>
        <!--body wrapper end-->
    </section>

    <script charset="utf-8" src="__PUBLIC__/Editor/kindeditor.js"></script>
    <!--<script charset="utf-8" src="__PUBLIC__/Home/js/jquery-form.js"></script>-->
    <script src="__PUBLIC__/Admin/js/bootstrap-fileupload.min.js"></script>
    <script type="text/javascript">

        KindEditor.ready(function(K) {
            window.editor = K.create('#editor_id');

        });

        KindEditor.options.filterMode = false;

        KindEditor.ready(function(K) {
            K.create('#editor_id');
        });


        var color="1";


    </script>


    <script type="text/javascript" src="__PUBLIC__/Admin/js/add.js"></script>
</block>


<script>
    $(function () {
        //0.初始化fileinput
        var oFileInput = new FileInput();
        oFileInput.Init("myFile", "/Admin/Works/uploadImage/");
    });
    var FileInput = function () {
        var oFile = new Object();

        //初始化fileinput控件（第一次初始化）
        oFile.Init = function (ctrlName, uploadUrl) {
            var control = $('#' + ctrlName);

            //初始化上传控件的样式
            control.fileinput({
                language: 'zh', //设置语言
                uploadUrl: uploadUrl, //上传的地址
                allowedFileExtensions: ['jpg', 'gif', 'png'],//接收的文件后缀
                //showUploadedThumbs:false,
                // uploadClass: 'hidden',
                showUpload: true, //是否显示上传按钮
                showCaption: false,//是否显示标题
                browseClass: "btn btn-info", //按钮样式
                dropZoneEnabled: false,//是否显示拖拽区域
                //minImageWidth: 150, //图片的最小宽度
                //minImageHeight: 150,//图片的最小高度
                // maxImageWidth: 150,//图片的最大宽度
                // maxImageHeight: 150,//图片的最大高度
                maxFileSize: 0,//单位为kb，如果为0表示不限制文件大小
                maxFileCount: 3, //表示允许同时上传的最大文件个数
                enctype: 'multipart/form-data',
                validateInitialCount: true,
                previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
                msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}！",
                fileActionSettings : {
                    showUpload: false,
                    //showRemove: false
                    showZoom:false
                }
            });

            //导入文件上传完成之后的事件
            $("#myFile").on("fileuploaded", function (event, data, previewId, index) {
                var file_name = data.files['0']['name'];
                console.log(data);
                alert(data.files);
                var inp_val = $('input[name=in_images]').val();
                var file_names = inp_val+file_name;
                $('input[name=in_images]').val(file_names);
            });
        }
        return oFile;
    };
</script>